<template>
  <div class="wrapper">
    <my-header
      v-if="
        this.pt != '/myspace' && this.pt != '/myregis' && this.pt != '/mylogin'
      "
    />
    <div class="main">
      <keep-alive>
        <router-view class="center" v-if="$route.meta.keepAlive" />
      </keep-alive>
      <router-view v-if="!$route.meta.keepAlive" />
    </div>
    <my-footer />
  </div>
</template>

<script>
import MyHeader from "@/components/MyHeader.vue";
import MyFooter from "@/components/MyFooter.vue";
export default {
  components: { MyHeader, MyFooter },
  data() {
    return {
      pt: "",
    };
  },
  mounted() {},
  watch: {
    $route(newValue, oldValue) {
      this.pt = this.$route.path.slice(0, 8);
      console.log("this.pt:", this.pt);
    },
  },
};
</script>

<style>
.wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.main {
  flex: 1;
}
.center {
  background-color: #e6e6e6;
}
</style>
